import React from "react";
import {ClsControl} from "../../block-control";
import {ControlBar} from "../../control-bar";
import {useAppDispatch, useAppSelector} from "../../../redux/hooks";
import {addProjectInfoItem, getProjectInfoList} from "../../../redux";
import {RProjExpItem} from "./rProjectExperienceItem";
import {MyIcon, SuTitle} from "../../su-title";
import {MedicineBoxOutlined} from "@ant-design/icons";

interface PropsType {

}

export const RProjExp: React.FC<PropsType> = ({}) => {
    const eduList = useAppSelector(getProjectInfoList);
    const dispatch = useAppDispatch();

    return <ClsControl canDrag={true} controlBar={
        <ControlBar
            style={{top: 0}}
            displayConfig={{ add: true}}
            onClickAdd={() => { dispatch(addProjectInfoItem()) }}
        ></ControlBar>
    }>
        <SuTitle title='项目经历' icon={
            // <span className='iconfont icon-xiangmujingli-03'></span>
            <MyIcon type={"xiangmujingli"}/>
        }></SuTitle>
        {
            eduList.map((eduInfo, index) =>
                <RProjExpItem
                    key={index}
                    index={index}
                    value={eduInfo}
                ></RProjExpItem>
            )
        }
    </ClsControl>
}
